<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>睿道测评在线答题考试</title>

<link href="../css/main.css" rel="stylesheet" type="text/css" th:href="@{static/css/main.css}"/>
<link href="../css/iconfont.css" rel="stylesheet" type="text/css" th:href="@{static/css/iconfont.css}"/>
<link href="../css/test.css" rel="stylesheet" type="text/css" th:href="@{static/css/test.css}"/>
<script src="../js/jquery-1.11.3.min.js" th:src="@{static/js/jquery-1.11.3.min.js}"></script>
<script src="../js/jquery.easy-pie-chart.js" th:src="@{static/js/jquery.easy-pie-chart.js}"></script>
<!--时间js-->
<script src="../js/jquery.countdown.js" th:src="@{static/js/jquery.countdown.js}"></script>
<link rel="stylesheet" href="../font-awesome-4.7.0/css/font-awesome.css" th:href="@{static/font-awesome-4.7.0/css/font-awesome.css}" />
<link rel="stylesheet" href="../css/res/layui/css/layui.css" th:href="@{static/css/res/layui/css/layui.css}" media="all">
<script src="../layuiadmin/layui/layui.js" th:src="@{static/layuiadmin/layui/layui.js}"></script>
<style>
.hasBeenAnswer {
	background: #5d9cec;
	color:#fff;
}
.markQuestion {
	background: #FF6633;
	color:#fff;
}
.emptyAnswer{}
</style>
<script>  
	/*屏幕切换监控*/
	var cheattimes = 0;
    document.addEventListener('visibilitychange',function(){
    	var acts = $("#allowedCheat").val();
	    if(document.visibilityState=='hidden') {  
	    	normal_title=document.title;
	    	cheattimes++;
	    	document.title='切换屏幕'+cheattimes+'次';
	    	alert("*警告：您已切换屏幕"+cheattimes+"次，本次考试累计切换屏幕"+acts+"次，系统将自动交卷。")
	    	if(cheattimes>=acts)
    		{
	    		var paper_id = $("#ansPaperId").val();
    			var s_id = $("#student_id").val();
    			var total_score = $("#totalScore").val();
    			var comment = "暂无";
    			var begin_exam_time = $("#beginTimeStamp").val();
    			var switch_time = cheattimes;
    			var pararms ={
					  "paper_id":paper_id,
					  "stu_id":s_id,
					  "totalScores":total_score,
					  "comment":comment,
					  "beginTimeStamp":begin_exam_time,
					  "switch_time":switch_time
				};
    			$.ajax({
					url:'analysePaper',
					type:'post',
					contentType:'application/json;charset=UTF-8',
					async:false,
					data:JSON.stringify(pararms),
					success:function(e){
						window.location.href = 'toExamOver?paper_id='+paper_id;
					},
					error:function(e){
						console.log(e);
						layui.use(['layer', 'form'], function(){
					  		var layer = layui.layer
					  			,form = layui.form;
					  			layer.msg('修改数据库出错！');
						});
					}
				});
    		}
	    		//$("form[id='paper']").submit();
	    }  
	    else  
	    	document.title=normal_title;  
    });  
         
</script>
<script>

</script>
<script>
	/*添加标记题目同步答题卡事件*/
	$(function(){

		$("b[class='fa fa-bookmark-o']").click(function(){
			var theclass=['fa fa-bookmark-o','fa fa-bookmark'];
			
			if($(this).attr("class")=="fa fa-bookmark-o"){
				$(this).attr("class","fa fa-bookmark");
				var examId = $(this).parent().prev().prev().closest('li').attr('id'); // 得到题目ID;
				var cardLi = $('a[href=#' + examId + ']'); // 根据题目ID找到对应答题卡;
				// 设置已答题
				cardLi.addClass('markQuestion');		
			}
			else{
				var examId = $(this).parent().prev().prev().closest('li').attr('id'); // 得到题目ID;
				var cardLi = $('a[href=#' + examId + ']'); // 根据题目ID找到对应答题卡;
				$(this).attr("class","fa fa-bookmark-o");
				cardLi.removeClass('markQuestion');
			}
		})
	})
	
	/*做完某道题，定位答题卡标记蓝色表示已做的事件*/
	$(function() {
		//单选或者多选与判断的点击事件
		$('li.option').click(function() {
			var examId = $(this).closest('.test_content_nr_main').closest('li').attr('id'); // 得到题目ID
			var cardLi = $('a[href=#' + examId + ']'); // 根据题目ID找到对应答题卡
			var paperId = $("#ansPaperId").val();
			if($(this).is(":has(input[type='checkbox'])"))
			{
				//选中的选项题型是多选
				if($(this).find("input[type='checkbox']").is(':checked'))
				{
					//alert("选中了");
					if(!cardLi.hasClass('hasBeenAnswer')){
						cardLi.addClass('hasBeenAnswer');
						cardLi.removeClass('emptyAnswer');
					}
				}
				else
				{
					//alert("取消选中,判断其他兄弟有没有被选中");
					if($(this).siblings().find("input[type='checkbox']").is(':checked'))
					{
						//alert("还有兄弟被选中了");
						if(!cardLi.hasClass('hasBeenAnswer')){
							cardLi.addClass('hasBeenAnswer');
							cardLi.removeClass('emptyAnswer');
						}
					}
					else
					{
						//alert("全没选中");
						// 设置已答题
						if(cardLi.hasClass('hasBeenAnswer')){
							cardLi.removeClass('hasBeenAnswer');
							cardLi.addClass('emptyAnswer');
						}
					}
					
				}
			}
			else {
				// 设置已答题
				if(!cardLi.hasClass('hasBeenAnswer')){
					cardLi.addClass('hasBeenAnswer');
					cardLi.removeClass('emptyAnswer');
				}
			}
			//以上步骤是在答题卡添加或者减少蓝色标记
			//接下来是通过ajax添加答题记录进入数据库
			var questype = $(this).find("input[type]").attr("que_type");
			var quesid = $(this).find("input[type]").attr("que_id");
			var totalScore = $(this).find("input[type]").attr("totalScore");
			var answer;//自己选择的答案
			var rightanswer;//标准答案
			var iscorrect;//是否正确
			var score;
			
			if(questype==1||questype==2)//单选或者多选题
			{
				if(questype==1)
				{
					//$(this).closest("ul")
					var choose = $(this).find("input[type]").val();
					
					if(choose==1)
						answer = "1 0 0 0";
					else if(choose==2)
						answer = "0 1 0 0";
					else if(choose==3)
						answer = "0 0 1 0";
					else
						answer = "0 0 0 1";
				}
				else
				{
					answer="";
					if($($(this).closest("ul").find("input[type='checkbox']").get(0)).is(':checked'))
						answer += "1 "; 
					else
						answer += "0 ";
					if($($(this).closest("ul").find("input[type='checkbox']").get(1)).is(':checked'))
						answer += "1 "; 
					else
						answer += "0 ";	
					if($($(this).closest("ul").find("input[type='checkbox']").get(2)).is(':checked'))
						answer += "1 "; 
					else
						answer += "0 ";	
					if($($(this).closest("ul").find("input[type='checkbox']").get(3)).is(':checked'))
						answer += "1"; 
					else
						answer += "0";
				}
				var rightanswer = $(this).find("input[type]").attr("rightanswer");
				
				if(answer==rightanswer)
				{
					iscorrect = 1;
					score = totalScore;
				}
				else
				{
					iscorrect = 0;
					score = 0;
				}
				
			}
			else if(questype==4)//判断题
			{
				var rightanswer = $(this).find("input[type]").attr("rightanswer");
				answer = $(this).find("input[type]").val();
				if(answer==rightanswer)
				{
					iscorrect = 1;
					score = totalScore;
				}
				else
				{
					iscorrect = 0;
					score = 0;
				}
			}
			else//填空或者简答题
			{
				var rightanswer = $(this).find("input[type]").attr("rightanswer");
				answer = $(this).find("input[type]").val();
				score = 0;//需要老师评判
				iscorrect = 0;//需要老师评判
			}
			var pararms ={
					  "paperResultId":paperId,
					  "questype":questype,
					  "quesid":quesid,
					  "score":score,
					  "totalScore":totalScore,
					  "answer":answer,
					  "rightanswer":rightanswer,
					  "iscorrect":iscorrect
				};// 定义一个js对象
				$.ajax({
					url:'updateQuestion',
					type:'post',
					contentType:'application/json;charset=UTF-8',
					async:false,
					data:JSON.stringify(pararms),
					success:function(e){
						
					},
					error:function(e){
						console.log(e);
						layui.use(['layer', 'form'], function(){
					  		var layer = layui.layer
					  			,form = layui.form;
					  			layer.msg('修改数据库出错！');
						});
					}
				});

		});
		
		//填空题是否填写的监控事件
		$("input[type='text']").blur(function(){
			var paperId = $("#ansPaperId").val();
			var answer = $(this).val();
			var textId = $(this).closest('li').attr('id');
			var cardLi = $('a[href=#' + textId + ']'); // 根据题目ID找到对应答题卡
			if(answer=="")
			{
				cardLi.removeClass('hasBeenAnswer');
				cardLi.addClass('emptyAnswer');
			}
			else
			{
				cardLi.removeClass('emptyAnswer');
				cardLi.addClass('hasBeenAnswer');
			}
			
			var questype = $(this).attr("que_type");
			var quesid = $(this).attr("que_id");
			var totalScore = $(this).attr("totalScore");
			var rightanswer = $(this).attr("rightanswer");;//标准答案
			var iscorrect = 0;//需要老师评判
			var score = 0;
			
			var pararms ={
					  "paperResultId":paperId,
					  "questype":questype,
					  "quesid":quesid,
					  "score":score,
					  "totalScore":totalScore,
					  "answer":answer,
					  "rightanswer":rightanswer,
					  "iscorrect":iscorrect
				};// 定义一个js对象
				$.ajax({
					url:'updateQuestion',
					type:'post',
					contentType:'application/json;charset=UTF-8',
					async:false,
					data:JSON.stringify(pararms),
					success:function(e){
						
					},
					error:function(e){
						console.log(e);
						layui.use(['layer', 'form'], function(){
					  		var layer = layui.layer
					  			,form = layui.form;
					  			layer.msg('修改数据库出错！');
						});
					}
				});
			
		})
		
		//简答题是否填写的监控事件
		$("textarea[type='text']").blur(function(){
			var paperId = $("#ansPaperId").val();
			var answer = $(this).val();
			var textId = $(this).closest('li').attr('id');
			var cardLi = $('a[href=#' + textId + ']'); // 根据题目ID找到对应答题卡
			if(answer=="")
			{
				cardLi.removeClass('hasBeenAnswer');
				cardLi.addClass('emptyAnswer');
			}
			else
			{
				cardLi.removeClass('emptyAnswer');
				cardLi.addClass('hasBeenAnswer');
			}
			
			var questype = $(this).attr("que_type");
			var quesid = $(this).attr("que_id");
			var totalScore = $(this).attr("totalScore");
			var rightanswer = $(this).attr("rightanswer");;//标准答案
			var iscorrect = 0;//需要老师评判
			var score = 0;
			
			var pararms ={
					  "paperResultId":paperId,
					  "questype":questype,
					  "quesid":quesid,
					  "score":score,
					  "totalScore":totalScore,
					  "answer":answer,
					  "rightanswer":rightanswer,
					  "iscorrect":iscorrect
				};// 定义一个js对象
				$.ajax({
					url:'updateQuestion',
					type:'post',
					contentType:'application/json;charset=UTF-8',
					async:false,
					data:JSON.stringify(pararms),
					success:function(e){
						
					},
					error:function(e){
						console.log(e);
						layui.use(['layer', 'form'], function(){
					  		var layer = layui.layer
					  			,form = layui.form;
					  			layer.msg('修改数据库出错！');
						});
					}
				});
			
			
		})
		
	});
</script>
<script>
	/*确认提交试卷的确认事件*/
	function confirmSubmit(){
	    var clickresult = false;
	    clickresult =window.confirm("提交试卷后内容不可更改,\n确定提交？");
	    if(clickresult==true)
	    {
	    	if($("div[class='rt_nr1']").find("li a").hasClass('emptyAnswer'))
	    	{
	    		clickresult =window.confirm("您的试卷还有未完成的题目,\n还是确定提交？");
	    		if(clickresult==true)
	    		{
	    			var paper_id = $("#ansPaperId").val();
	    			var s_id = $("#student_id").val();
	    			//var t_id = $("#teacher_id").val();
	    			//var acquired_score = 0;//从数据库查
	    			var total_score = $("#totalScore").val();
	    			var comment = "暂无";
	    			var begin_exam_time = $("#beginTimeStamp").val();

   
	    			var switch_time = cheattimes;
	    			var pararms ={
						  "paper_id":paper_id,
						  "stu_id":s_id,
						  "totalScores":total_score,
						  "comment":comment,
						  "beginTimeStamp":begin_exam_time,
						  "switch_time":switch_time
					};
	    			$.ajax({
						url:'analysePaper',
						type:'post',
						contentType:'application/json;charset=UTF-8',
						async:false,
						data:JSON.stringify(pararms),
						success:function(e){
							window.location.href = 'toExamOver?paper_id='+paper_id;
						},
						error:function(e){
							console.log(e);
							layui.use(['layer', 'form'], function(){
						  		var layer = layui.layer
						  			,form = layui.form;
						  			layer.msg('修改数据库出错！');
							});
						}
					});
	    		}
	    			/*$("form[id='paper']").submit();*/
	    	}
	    	else//所有题都做完了
	    	{
	    		var paper_id = $("#ansPaperId").val();
    			var s_id = $("#student_id").val();
    			//var t_id = $("#teacher_id").val();
    			//var acquired_score = 0;//从数据库查
    			var total_score = $("#totalScore").val();
    			var comment = "暂无";
    			var begin_exam_time = $("#beginTimeStamp").val();
    			var switch_time = cheattimes;
    			var pararms ={
					  "paper_id":paper_id,
					  "stu_id":s_id,
					  "totalScores":total_score,
					  "comment":comment,
					  "beginTimeStamp":begin_exam_time,
					  "switch_time":switch_time
				};
    			$.ajax({
					url:'analysePaper',
					type:'post',
					contentType:'application/json;charset=UTF-8',
					async:false,
					data:JSON.stringify(pararms),
					success:function(e){
						window.location.href = 'toExamOver?paper_id='+paper_id;
					},
					error:function(e){
						console.log(e);
						layui.use(['layer', 'form'], function(){
					  		var layer = layui.layer
					  			,form = layui.form;
					  			layer.msg('修改数据库出错！');
						});
					}
				});
	    	}
		    	
	    }
	    else
	    	return clickresult;
	}
</script>
<script>
	/*$(function(){
		$('.test_content').toggle(function(){//点击一下，缓慢出现
			$(this).next().show('slow');	
			//find("div[class='test_content_nr']").
			//$(this).find('span').addClass("jian");
			//$(this).children('span').addClass('jian');
		},
		function(){
			$(this).next().hide('slow');
			//$(this).next().hide('slow');
			//$(this).find('span').removeClass("jian");
			//$(this).removeClass('bgreen');
		})
	})*/
</script>

</head>
<body >

<div class="main">
	<!--nr start-->
	<div class="test_main">
		<div class="nr_left">
			<div class="test">
				<!--<form id="paper" action="toExamOver" method="post">-->
					<div class="test_title">
						<p class="test_time">
							<i class="fa fa-clock-o"></i><b id="alt-1" class="alt-1">00:01</b>
						</p>
						<font><input type="button" name="test_jiaojuan" onclick="return confirmSubmit()" value="交卷"></font>
					</div>
					
					<!--下面是单选题-->
					<div id="single_choice" th:style="'display:'+@{((${singleChoice.size()}==0)?'none':'block')}">
						<div class="test_content">
							<div class="test_content_title">
								<h2>单选题</h2>
								<p>
									<span>共</span><i class="content_lit" th:text="${singleChoice.size()}"></i><span>题，</span><span>合计</span><i class="content_fs" th:text="${singleChoiceTotalScore}"></i><span>分</span>
								</p>
							</div>
						</div>
						<div class="test_content_nr">
							<ul >
								<div th:each="single_choice:${singleChoice}">
									<li th:id="|qu_0_${singleChoice.indexOf(single_choice)}|">
										<div class="test_content_nr_tt">
											<i th:text="${singleChoice.indexOf(single_choice)+1}"></i><span th:text="|(${single_choice.getScore()}分)|"></span>
											<font th:text="${single_choice.getContent()}"></font></font><a href="#" title="标记此题" ><b class="fa fa-bookmark-o"></b></a>
										</div>

										<div class="test_content_nr_main">
											<ul>
													<li class="option">
															<input type="radio" class="radioOrCheck" th:name="|answer${singleChoice.indexOf(single_choice)+1}|"
																th:id="|0_answer_${singleChoice.indexOf(single_choice)+1}_option_1|"
																th:que_type="${single_choice.getQuesTypeId()}"
																th:que_id="${single_choice.getChoiceQuesId()}"
																th:rightanswer="${single_choice.getAnswer()}"
																value="1"
																th:totalScore="${single_choice.getScore()}"
																
															/>
														<label th:for="|0_answer_${singleChoice.indexOf(single_choice)+1}_option_1|">
															<!--A.-->
															<p class="ue" style="display: inline;" th:text="${single_choice.getChoice1()}"></p>
														</label>
													</li>
												
													<li class="option">
															<input type="radio" class="radioOrCheck" th:name="|answer${singleChoice.indexOf(single_choice)+1}|"
																th:id="|0_answer_${singleChoice.indexOf(single_choice)+1}_option_2|"
																th:que_type="${single_choice.getQuesTypeId()}"
																th:que_id="${single_choice.getChoiceQuesId()}"
																th:rightanswer="${single_choice.getAnswer()}"
																value="2"
																th:totalScore="${single_choice.getScore()}"
															/>
														<label th:for="|0_answer_${singleChoice.indexOf(single_choice)+1}_option_2|">
															<!--B.-->
															<p class="ue" style="display: inline;" th:text="${single_choice.getChoice2()}"></p>
														</label>
													</li>
												
													<li class="option">
															<input type="radio" class="radioOrCheck" th:name="|answer${singleChoice.indexOf(single_choice)+1}|"
																th:id="|0_answer_${singleChoice.indexOf(single_choice)+1}_option_3|"
																th:que_type="${single_choice.getQuesTypeId()}"
																th:que_id="${single_choice.getChoiceQuesId()}"
																th:rightanswer="${single_choice.getAnswer()}"
																value="3"
																th:totalScore="${single_choice.getScore()}"
															/>
														<label th:for="|0_answer_${singleChoice.indexOf(single_choice)+1}_option_3|">
															<!--C.-->
															<p class="ue" style="display: inline;" th:text="${single_choice.getChoice3()}"></p>
														</label>
													</li>
												
													<li class="option">
															<input type="radio" class="radioOrCheck" th:name="|answer${singleChoice.indexOf(single_choice)+1}|"
																th:id="|0_answer_${singleChoice.indexOf(single_choice)+1}_option_4|"
																th:que_type="${single_choice.getQuesTypeId()}"
																th:que_id="${single_choice.getChoiceQuesId()}"
																th:rightanswer="${single_choice.getAnswer()}"
																value="4"
																th:totalScore="${single_choice.getScore()}"
															/>
														<label th:for="|0_answer_${singleChoice.indexOf(single_choice)+1}_option_4|">
															<!--D.-->
															<p class="ue" style="display: inline;" th:text="${single_choice.getChoice4()}"></p>
														</label>
													</li>
											</ul>
										</div>
									</li>
								</div>
							</ul>
						</div>
					</div>
						<!--下面是多选题-->
					<div id="multiple_choice" th:style="'display:'+@{((${multipleChoice.size()}==0)?'none':'block')}">
						<div class="test_content">
							<div class="test_content_title">
								<h2>多选题</h2>
								<p>
									<span>共</span><i class="content_lit" th:text="${multipleChoice.size()}"></i><span>题，</span><span>合计</span><i class="content_fs" th:text="${multiChoiceTotalScore}"></i><span>分</span>
								</p>
							</div>
						</div>
						<div class="test_content_nr">
							<ul>
								<div th:each="multiple_choice:${multipleChoice}">
									<li th:id="|qu_1_${multipleChoice.indexOf(multiple_choice)}|">
										<div class="test_content_nr_tt">
											<i th:text="${multipleChoice.indexOf(multiple_choice)+1}" ></i><span th:text="|(${multiple_choice.getScore()}分)|"></span>
											<font th:text="${multiple_choice.getContent()}"></font></font><a href="#" title="标记此题" ><b class="fa fa-bookmark-o"></b></a>
										</div>

										<div class="test_content_nr_main">
											<ul>
													<li class="option">
															<input type="checkbox" class="radioOrCheck" th:name="|answer${multipleChoice.indexOf(multiple_choice)+1}|"
																th:id="|1_answer_${multipleChoice.indexOf(multiple_choice)+1}_option_1|"
																th:que_type="${multiple_choice.getQuesTypeId()}"
																th:que_id="${multiple_choice.getChoiceQuesId()}"
																th:rightanswer="${multiple_choice.getAnswer()}"
																th:totalScore="${multiple_choice.getScore()}"
															/>
														<label th:for="|1_answer_${multipleChoice.indexOf(multiple_choice)+1}_option_1|">
															<!--A.-->
															<p class="ue" style="display: inline;" th:text="${multiple_choice.getChoice1()}"></p>
														</label>
													</li>
												
													<li class="option">
															<input type="checkbox" class="radioOrCheck" th:name="|answer${multipleChoice.indexOf(multiple_choice)+1}|"
																th:id="|1_answer_${multipleChoice.indexOf(multiple_choice)+1}_option_2|"
																th:que_type="${multiple_choice.getQuesTypeId()}"
																th:que_id="${multiple_choice.getChoiceQuesId()}"
																th:rightanswer="${multiple_choice.getAnswer()}"
																th:totalScore="${multiple_choice.getScore()}"
															/>
														<label th:for="|1_answer_${multipleChoice.indexOf(multiple_choice)+1}_option_2|">
															<!--B.-->
															<p class="ue" style="display: inline;" th:text="${multiple_choice.getChoice2()}"></p>
														</label>
													</li>
												
													<li class="option">
															<input type="checkbox" class="radioOrCheck" th:name="|answer${multipleChoice.indexOf(multiple_choice)+1}|"
																th:id="|1_answer_${multipleChoice.indexOf(multiple_choice)+1}_option_3|"
																th:que_type="${multiple_choice.getQuesTypeId()}"
																th:que_id="${multiple_choice.getChoiceQuesId()}"
																th:rightanswer="${multiple_choice.getAnswer()}"
																th:totalScore="${multiple_choice.getScore()}"
																
															/>
														<label th:for="|1_answer_${multipleChoice.indexOf(multiple_choice)+1}_option_3|">
															<!--C.-->
															<p class="ue" style="display: inline;" th:text="${multiple_choice.getChoice3()}"></p>
														</label>
													</li>
												
													<li class="option">
															<input type="checkbox" class="radioOrCheck" th:name="|answer${multipleChoice.indexOf(multiple_choice)+1}|"
																th:id="|1_answer_${multipleChoice.indexOf(multiple_choice)+1}_option_4|"
																th:que_type="${multiple_choice.getQuesTypeId()}"
																th:que_id="${multiple_choice.getChoiceQuesId()}"
																th:rightanswer="${multiple_choice.getAnswer()}"
																th:totalScore="${multiple_choice.getScore()}"
															/>
														<label th:for="|1_answer_${multipleChoice.indexOf(multiple_choice)+1}_option_4|">
															<!--D.-->
															<p class="ue" style="display: inline;" th:text="${multiple_choice.getChoice4()}"></p>
														</label>
													</li>
												
											</ul>
										</div>
									</li>
								</div>
							</ul>
						</div>
					</div>
						<!--下面是判断题-->
					<div id="judge_question" th:style="'display:'+@{((${judgeQuestion.size()}==0)?'none':'block')}">
						<div  class="test_content">
							<div class="test_content_title">
								<h2>判断题</h2>
								<p>
									<span>共</span><i class="content_lit" th:text="${judgeQuestion.size()}"></i><span>题，</span><span>合计</span><i class="content_fs" th:text="${judgeChoiceTotalScore}"></i><span>分</span>
								</p>
							</div>
						</div>
						<div class="test_content_nr">
							<ul>
								<div th:each="judge_question:${judgeQuestion}" style="line-height:23px">
									
									<li th:id="|qu_2_${judgeQuestion.indexOf(judge_question)}|">
											<div class="test_content_nr_tt">
												<i th:text="${judgeQuestion.indexOf(judge_question)+1}"></i><span th:text="|(${judge_question.getScore()}分)|"></span>
												<font th:text="${judge_question.getContent()}"></font></font><a href="#" title="标记此题" ><b class="fa fa-bookmark-o"></b></a>
											</div>
	
											<div class="test_content_nr_main">
												<ul>
														<li class="option">
																<input type="radio" class="radioOrCheck" th:name="|judge_answer${judgeQuestion.indexOf(judge_question)+1}|"
																	th:id="|2_answer_${judgeQuestion.indexOf(judge_question)+1}_option_1|"
																	th:que_type="${judge_question.getQuesTypeId()}"
																	th:que_id="${judge_question.getJudgeId()}"
																	th:rightanswer="${judge_question.getAnswer()}"
																	th:totalScore="${judge_question.getScore()}"
																	value="1"
																/>
															<label th:for="|2_answer_${judgeQuestion.indexOf(judge_question)+1}_option_1|">
																A.
																<p class="ue" style="display: inline;">正确</p>
															</label>
														</li>
													
														<li class="option">
																<input type="radio" class="radioOrCheck" th:name="|judge_answer${judgeQuestion.indexOf(judge_question)+1}|"
																	th:id="|2_answer_${judgeQuestion.indexOf(judge_question)+1}_option_2|"
																	th:que_type="${judge_question.getQuesTypeId()}"
																	th:que_id="${judge_question.getJudgeId()}"
																	th:rightanswer="${judge_question.getAnswer()}"
																	th:totalScore="${judge_question.getScore()}"
																	value="0"
																/>
															<label th:for="|2_answer_${judgeQuestion.indexOf(judge_question)+1}_option_2|">
																B.
																<p class="ue" style="display: inline;">错误</p>
															</label>
														</li>
												</ul>
											</div>
									</li>
								</div>
																	
							</ul>
						</div>
					</div>
						<!--下面是填空题-->
					<div id="fillblank_question" th:style="'display:'+@{((${fillBlankQuestion.size()}==0)?'none':'block')}">
						<div class="test_content">
							<div class="test_content_title">
								<h2>填空题</h2>
								<p>
									<span>共</span><i class="content_lit" th:text="${fillBlankQuestion.size()}"></i><span>题，</span><span>合计</span><i class="content_fs" th:text="${fillBlankTotalScore}"></i><span>分</span>
								</p>
							</div>
						</div>
						<div class="test_content_nr">
							<ul>
								<div th:each="fillblank_question:${fillBlankQuestion}">
									<li th:id="|qu_3_${fillBlankQuestion.indexOf(fillblank_question)}|">
											<div class="test_content_nr_tt">
												<i th:text="${fillBlankQuestion.indexOf(fillblank_question)+1}"></i><span th:text="|(${fillblank_question.getScore()}分)|"></span>
												<font th:text="${fillblank_question.getContent()}"></font></font><a href="#" title="标记此题" ><b class="fa fa-bookmark-o"></b></a>
											</div>
	
											<div class="test_content_nr_main">
												<ul>
													<input style="width:400px;height:20px" type="text" class="radioOrCheck" placeholder="若有多个填空项，答案之间请用逗号隔开" 
														th:name="|answer${fillBlankQuestion.indexOf(fillblank_question)+1}|"
														th:que_type="${fillblank_question.getQuesTypeId()}"
														th:que_id="${fillblank_question.getQuesAnsId()}"
														th:totalScore="${fillblank_question.getScore()}"
														th:rightanswer="${fillblank_question.getAnswer()}"
														/>
												</ul>
											</div>
									</li>
								</div>
							</ul>
						</div>
					</div>
						<!--下面是简答题-->
					<div id="shortanswer_question" th:style="'display:'+@{((${shortAnswerQuestion.size()}==0)?'none':'block')}">
						<div class="test_content">
							<div class="test_content_title">
								<h2>简答题</h2>
								<p>
									<span>共</span><i class="content_lit" th:text="${shortAnswerQuestion.size()}"></i><span>题，</span><span>合计</span><i class="content_fs" th:text="${shortAnswerTotalScore}"></i><span>分</span>
								</p>
							</div>
						</div>
						<div class="test_content_nr">
							<ul>
								<div th:each="shortanswer_question:${shortAnswerQuestion}">
									<li th:id="|qu_4_${shortAnswerQuestion.indexOf(shortanswer_question)}|">
											<div class="test_content_nr_tt">
												<i th:text="${shortAnswerQuestion.indexOf(shortanswer_question)+1}"></i><span th:text="|(${shortanswer_question.getScore()}分)|"></span>
												<font th:text="${shortanswer_question.getContent()}"></font></font><a href="#" title="标记此题" ><b class="fa fa-bookmark-o"></b></a>
											</div>
	
											<div class="test_content_nr_main">
												<ul>
													<textarea style="width:800px; height:100px" type="text" class="radioOrCheck" placeholder="请在这填写你的答案" 
														th:name="|answer${shortAnswerQuestion.indexOf(shortanswer_question)+1}|"
														th:que_type="${shortanswer_question.getQuesTypeId()}"
														th:que_id="${shortanswer_question.getQuesAnsId()}"
														th:totalScore="${shortanswer_question.getScore()}"
														th:rightanswer="${shortanswer_question.getAnswer()}"
														></textarea>
												</ul>
											</div>
									</li>
								</div>
							</ul>
						</div>
					</div>
				<!--</form>-->
			</div>

		</div>
		<div class="nr_right">
			<div class="nr_rt_main">
				<div class="rt_nr1">
					<div class="rt_nr1_title">
						<h1>
							<i class="fa fa-file-text"></i>答题卡
						</h1>
						<p class="test_time">
							<i class="fa fa-clock-o"></i><b id="alt-2" class="alt-2">00:01</b>
						</p>
					</div>
					
						<div class="rt_content" th:style="'display:'+@{((${singleChoice.size()}==0)?'none':'block')}">
							<div class="rt_content_tt">
								<h2>单选题</h2>
								<p>
									<span>共</span><i class="content_lit" th:text="${singleChoice.size()}"></i><span>题</span>
								</p>
							</div>
							<div class="rt_content_nr answerSheet">
								<ul>
										<li th:each="single_choice:${singleChoice}">
											<a class="emptyAnswer" th:href="|#qu_0_${singleChoice.indexOf(single_choice)}|" th:text="${singleChoice.indexOf(single_choice)+1}"></a>
										</li>
								</ul>
							</div>
						</div>
					
						<div class="rt_content" th:style="'display:'+@{((${multipleChoice.size()}==0)?'none':'block')}">
							<div class="rt_content_tt">
								<h2>多选题</h2>
								<p>
									<span>共</span><i class="content_lit" th:text="${multipleChoice.size()}"></i><span>题</span>
								</p>
							</div>
							<div class="rt_content_nr answerSheet">
								<ul >
										<li th:each="multiple_choice:${multipleChoice}">
											<a class="emptyAnswer" th:href="|#qu_1_${multipleChoice.indexOf(multiple_choice)}|" th:text="${multipleChoice.indexOf(multiple_choice)+1}"></a>
										</li>
									
								</ul>
							</div>
						</div>
						<div class="rt_content" th:style="'display:'+@{((${judgeQuestion.size()}==0)?'none':'block')}">
							<div class="rt_content_tt">
								<h2>判断题</h2>
								<p>
									<span>共</span><i class="content_lit" th:text="${judgeQuestion.size()}"></i><span>题</span>
								</p>
							</div>
							<div class="rt_content_nr answerSheet">
								<ul >
										<li th:each="judge_question:${judgeQuestion}">
											<a class="emptyAnswer" th:href="|#qu_2_${judgeQuestion.indexOf(judge_question)}|" th:text="${judgeQuestion.indexOf(judge_question)+1}"></a>
										</li>
								</ul>
							</div>
						</div>
						
						<div class="rt_content" th:style="'display:'+@{((${fillBlankQuestion.size()}==0)?'none':'block')}">
							<div class="rt_content_tt">
								<h2>填空题</h2>
								<p>
									<span>共</span><i class="content_lit" th:text="${fillBlankQuestion.size()}"></i><span>题</span>
								</p>
							</div>
							<div class="rt_content_nr answerSheet">
								<ul >
										<li th:each="fillblank_question:${fillBlankQuestion}">
											<a class="emptyAnswer" th:href="|#qu_3_${fillBlankQuestion.indexOf(fillblank_question)}|" th:text="${fillBlankQuestion.indexOf(fillblank_question)+1}"></a>
										</li>
								</ul>
							</div>
						</div>
						
						<div class="rt_content" th:style="'display:'+@{((${shortAnswerQuestion.size()}==0)?'none':'block')}">
							<div class="rt_content_tt">
								<h2>简答题</h2>
								<p>
									<span>共</span><i class="content_lit" th:text="${shortAnswerQuestion.size()}"></i><span>题</span>
								</p>
							</div>
							<div class="rt_content_nr answerSheet">
								<ul>
										<li th:each="shortanswer_question:${shortAnswerQuestion}">
											<a class="emptyAnswer" th:href="|#qu_4_${shortAnswerQuestion.indexOf(shortanswer_question)}|" th:text="${shortAnswerQuestion.indexOf(shortanswer_question)+1}"></a>
										</li>
								</ul>
							</div>
						</div>
					
				</div>

			</div>
		</div>
	</div>
	<!--nr end-->
	<input type="hidden" id="totalScore" th:value='${totalScore}'>
	<input type="hidden" id="student_id" th:value='${student_id}'>
	<input type="hidden" id="teacher_id" th:value='${teacher_id}'>
	<input type="hidden" id="interval" th:value='${interval}'>
	<input type="hidden" id="beginTimeStamp" th:value='${begin_tstamp}'>
	<input type="hidden" id="paperId" th:value='${paper_id}'>
	<input type="hidden" id="ansPaperId" th:value='${ans_paper_id}'>
	<input type="hidden" id="allowedCheat" th:value='${allowedCheat}'>
	<div class="foot"><span id="fullScreen">听说你想全屏？</span></div>
</div>

<script type="text/javascript">
	//倒计时监控事件
   	window.onload=function(){
        daojishi();
        //$("#fullScreen").trigger("click");
    }

 	var counttime= $("#interval").val(); //100*60;//总秒钟,60秒
     
    function daojishi(){
    	if(counttime>=0){
        	var ms = counttime%60;//余数 89%60==29秒
            var mis = Math.floor(counttime/60);//分钟
            if(mis>=60){
            	var hour=Math.floor(mis/60);
     			mis=Math.floor((counttime-hour*60*60)/60);
				$("#alt-1").html("考试时间剩余"+hour+"小时"+mis+"分"+ms+"秒");
				$("#alt-2").html(hour+":"+mis+":"+ms);
             }else if(mis>=1){
              	$("#alt-1").html("考试时间剩余"+mis+"分"+ms+"秒");
              	if(mis<10)
              		$("#alt-2").html("00:0"+mis+":"+ms);
          		else
          			$("#alt-2").html("00:"+mis+":"+ms);
             }else{
             	$("#alt-1").html("考试时间剩余"+ms+"秒");
             	$("#alt-2").html("00:00:"+ms);
             }
             counttime--;
             vartt =  window.setTimeout("daojishi()",1000);
	  	}else{
	      	window.clearTimeout(vartt);
	      	//window.confirm("考试时间结束"); 
	      	tijiao();
	  	}
     }
     
     function tijiao(){
     	alert("考试时间结束，系统自动提交！");
     	var paper_id = $("#ansPaperId").val();
		var s_id = $("#student_id").val();
		var total_score = $("#totalScore").val();
		var comment = "暂无";
		var begin_exam_time = $("#beginTimeStamp").val();
		var switch_time = cheattimes;
		var pararms ={
			  "paper_id":paper_id,
			  "stu_id":s_id,
			  "totalScores":total_score,
			  "comment":comment,
			  "beginTimeStamp":begin_exam_time,
			  "switch_time":switch_time
		};
		$.ajax({
			url:'analysePaper',
			type:'post',
			contentType:'application/json;charset=UTF-8',
			async:false,
			data:JSON.stringify(pararms),
			success:function(e){
				window.location.href = 'toExamOver?paper_id='+paper_id;
			},
			error:function(e){
				console.log(e);
				layui.use(['layer', 'form'], function(){
			  		var layer = layui.layer
			  			,form = layui.form;
			  			layer.msg('修改数据库出错！');
				});
			}
		});
        
     }
     
     
     
</script>
<script>
//屏蔽鼠标右键、Ctrl+N、Shift+F10、F11、F5刷新、退格键
document.oncontextmenu = function(){
	return false;
}//屏蔽鼠标右键
window.onhelp = function(){
	return false;
} //屏蔽F1帮助
document.onkeydown = function(){
	if((window.event.altKey)&&((window.event.keyCode==37)||(window.event.keyCode==39))){
	//屏蔽Alt+方向键←
	//屏蔽Alt+方向键→
	event.returnValue=false;
	}
	if((event.keyCode==116)||(event.ctrlKey && event.keyCode==82)){
	//屏蔽退格删除键(event.keyCode==8)||
	//屏蔽F5刷新键
	//Ctrl+R
	event.keyCode=0;
	event.returnValue=false;
	}
	if(event.keyCode==122){
		event.keyCode=0;//0
		event.returnValue=false;//false
	} //屏蔽F11
	/*if(event.keyCode==123){
		event.keyCode=0;//0
		event.returnValue=false;//false
	} //屏蔽F12*/
	if(event.ctrlKey && event.keyCode==78)
		event.returnValue=false; //屏蔽Ctrl+n
	if(event.shiftKey && event.keyCode==121)
		event.returnValue=false; //屏蔽shift+F10
	if(window.event.srcElement.tagName=="A" && window.event.shiftKey)
		window.event.returnValue=false; //屏蔽shift加鼠标左键新开一网页
	if((window.event.altKey)&&(window.event.keyCode==115)){ //屏蔽Alt+F4
		window.showModelessDialog("about:blank","","dialogWidth:1px;dialogheight:1px");
		return false;
	}
}
</script> 
<script>
	$(function(){
	    //全屏
	    $("#fullScreen").on("click",function(){
	        fullScreen();
	    })
	    //退出全屏
	    $("#exitFullScreen").on("click",function(){
	        exitFullscreen();
	    })
	})
	
	//fullScreen()和exitScreen()有多种实现方式，此处只使用了其中一种
	//全屏
	function fullScreen() {
	    var element = document.documentElement;
	    if (element.requestFullscreen) {
	        element.requestFullscreen();
	    } else if (element.msRequestFullscreen) {
	        element.msRequestFullscreen();
	    } else if (element.mozRequestFullScreen) {
	        element.mozRequestFullScreen();
	    } else if (element.webkitRequestFullscreen) {
	        element.webkitRequestFullscreen();
	    }
	}
	
	//退出全屏 
	function exitFullscreen() {
	    if (document.exitFullscreen) {
	        document.exitFullscreen();
	    } else if (document.msExitFullscreen) {
	        document.msExitFullscreen();
	    } else if (document.mozCancelFullScreen) {
	        document.mozCancelFullScreen();
	    } else if (document.webkitExitFullscreen) {
	        document.webkitExitFullscreen();
	    }
	}
	
	//监听window是否全屏，并进行相应的操作,支持esc键退出
	window.onresize = function() {
	    var isFull=!!(document.webkitIsFullScreen || document.mozFullScreen || 
	        document.msFullscreenElement || document.fullscreenElement
	    );//!document.webkitIsFullScreen都为true。因此用!!
	    if (isFull==false) {
	        $("#exitFullScreen").css("display","none");
	        $("#fullScreen").css("display","");
	    }else{
	        $("#exitFullScreen").css("display","");
	        $("#fullScreen").css("display","none");
	    }
	}

</script>

</body>
</html>
